// 引入发请求的api
import { reqGetDetailInfo, reqAddOrUpdateShopCart } from '@/api/index'
// 引入生成游客id的模块
import { getNanoid } from '@/utils/nanoid_token/index'
// Detail模块的仓库
const state = {
    detail: {},
    nanoid_token: getNanoid()
}

const actions = {
    async getDeatilInfo({ commit }, skuId) {
        let res = await reqGetDetailInfo(skuId);
        if (res.code == 200) {
            commit('GETDETAILINFO', res.data)
        }
    },
    // 将产品添加到购物车
    async addShopCart(_, { skuId, num }) {
        // async函数返回的对象一定是一个promise
        // 方法1:直接将请求的promise对象返回到组件,在组件中判断是否添加成功
        let res = await reqAddOrUpdateShopCart(skuId, num);
        if (res.code == 200) {
            // 将参数带给服务器写入数据库
            // 服务器不会返回其他数据
            // 只是返回code=200，表示请求服务器写入成功
            // 如果返回的状态码不是200，表示添加到购物车失败
            // 但是在组件中看不到添加是否成功
            // 方法2:可以直接把res添加到仓库，那么组件就可以看到res

            // 方法3:直接利用async函数返回的promise对象
            return '添加成功,点击前往购物车!'
        } else {
            return Promise.reject(new Error('添加到购物车失败!'));
        }
    },

}

const mutations = {
    GETDETAILINFO(state, detail) {
        state.detail = detail;
    },
}

// 简化数据
const getters = {
    categoryViews(state) {
        // 一开始数据尚未请求回来时，组件获取getters数据会得到undefined，
        // 等下组件中读取undefined的属性时会报错
        // 当数据为请求回来时，至少应该返回一个空对象
        return state.detail.categoryView || {};
    },
    skuInfo(state) {
        return state.detail.skuInfo || {};
    },
    spuSaleAttrList(state) {
        return state.detail.spuSaleAttrList || [];
    }
}

export default {
    state,
    mutations,
    actions,
    getters
}